// 加载组件
async function loadComponent(componentName, targetId) {
    try {
        if (!document.getElementById(targetId)) {
            console.log(`Target element #${targetId} not found, skipping ${componentName} component`);
            return;
        }
        const response = await fetch(`../components/${componentName}.php`);
        if (!response.ok) {
            throw new Error(`HTTP error! status: ${response.status}`);
        }
        const html = await response.text();
        const targetElement = document.getElementById(targetId);
        
        if (!targetElement) {
            console.log(`Target element #${targetId} not found, skipping ${componentName} component`);
            return;
        }
        
        targetElement.innerHTML = html;
        
        // 加载组件相关的 JavaScript
        const script = document.createElement('script');
        script.src = `../js/${componentName}.js`;
        script.onerror = () => {
            console.log(`JavaScript file for ${componentName} not found, skipping`);
        };
        document.body.appendChild(script);
        
    } catch (error) {
        console.log(`Error loading ${componentName}: ${error.message}`);
    }
}

// 页面加载完成后加载组件
document.addEventListener('DOMContentLoaded', async () => {
    try {
        console.log('Starting to load components');
        // 并行加载所有组件
        const components = ['navbar', 'footer', 'video-background', 'advantages', 'history', 'news', 'partners', 'culture', 'core-business', 'about', 'timeline', 'contact'];

        await Promise.all(components.map(component => loadComponent(component, component)));
        
        console.log('All components loaded successfully');
    } catch (error) {
        console.error('Error loading components:', error);
    }
}); 